<template>
    <div class="info">
        <b>Info</b>
        <hr>
        <div v-show="email">
            UID:{{uid}}<br>
            Name:{{Name}}<br>
            Email:{{email}}<br>
            Avatar:{{avatar}}<br>
            Status:{{status}}<br>
        </div>
        <div v-show="error" class="error">
            Error:{{error}}
        </div>
    </div>

</template>

<script>
    import {mapState,mapActions} from 'vuex';

    export default {
        name: 'Info',
        computed:{
            ...mapState('user',['uid','name','email','avatar','status'])
        },
        data(){
            return {
                error:''
            }
        },
        methods:{
            ...mapActions('user',['getUserInfo'])
        },
        created(){
            this.getUserInfo().catch(err=>{
                this.$data.error=err.msg || err.message || err;
            });
        }
    }
</script>

<style scoped>

</style>
